<!DOCTYPE html>
<html>
<head>
<title>Home</title>
    {% load static %}
<link href="{% static "news/css/bootstrap.css" %}" rel="stylesheet" type="text/css" media="all" />
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="{% static "news/js/jquery.min.js" %}"></script>
<!-- Custom Theme files -->
<!--theme-style-->
<link href="{% static "news/css/style.css" %}" rel="stylesheet" type="text/css" media="all" />
<!--//theme-style-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Inspired Responsive web template, Bootstrap Web Templates, Flat Web Templates, Andriod Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyErricsson, Motorola web design" />
<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
<!--fonts-->
<link href='http://fonts.useso.com/css?family=Lato:100,300,400,700,900' rel='stylesheet' type='text/css'>
<!--//fonts-->
<script type="text/javascript" src="{% static "news/js/move-top.js" %}"></script>
<script type="text/javascript" src="{% static "news/js/easing.js" %}"></script>
				<script type="text/javascript">
					jQuery(document).ready(function($) {
						$(".scroll").click(function(event){
							event.preventDefault();
							$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
						});
					});
					</script>

</head>
<body>
	<!--header-->
	<div class="container">
	<div class="header">
		<div class="header-top">
			<div class="logo">
				<a href="{% url "NewsIndex" %}"><img src="{% static "news/images/logo.png" %}" alt="" ></a>
			</div>
			<div class="header-top-on">
				<ul class="social-in">
					<li><span>Share This Page:</span></li>
					<li><a href="#"><i> </i></a></li>
					<li><a href="#"><i class="tin"> </i></a></li>
					<li><a href="#"><i class="message"> </i></a></li>
					<li><a href="#"><i class="youtube"> </i></a></li>
				</ul>
			</div>
				<div class="clearfix"> </div>
			</div>
			<!---->
			<div class="header-bottom">
				<div class="top-nav">
					<span class="menu"> </span>
					<ul>
						<li class="active" ><a href="{% url "NewsIndex" %}" >HOME  </a> </li>
						<li><a href="{% url "NewsEvents" %}" data-hover="EVENTS" > EVENTS</a></li>
						<li><a href="{% url "NewsSearch" %}" data-hover="SEARCH"> SEARCH </a></li>
						<li><a href="{% url "NewsCategory" %}" data-hover="CATEGORY"> CATEGORY</a></li>
						<li><a href="{% url "NewsRegister" %}" data-hover="REGISTER"> REGISTER </a></li>
						{% if not user.is_authenticated %}
						<li><a href="{% url "NewsLogin" %}" data-hover="LOGIN">LOGIN </a></li>
                        {% else %}
                        <li><a href="{% url "user_logout" %}" data-hover="LOGOUT">LOGOUT </a></li>
                        {% endif %}
					</ul>
					<!--script-->
				<script>
					$("span.menu").click(function(){
						$(".top-nav ul").slideToggle(500, function(){
						});
					});
			</script>
				</div>
					<div class="search">
						<form action="{% url "NewsSearchView" %}" method="get">
							<input type="text" placeholder="Search" name="search">
							<input type="submit" value="">
						</form>
					</div>
			<div class="clearfix"> </div>
		</div>
	</div>
</div>
		<!---->
		<div class="container">
			<div class="banner">
				<div class="banner-matter">
					<i class="line"> </i>
						<h1>今日看点</h1>
					<i class="line"> </i>
				</div>
{#				<p class="help"></p>#}
				<!--manage-->
{#                <div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >企业网站模板</a></div>#}
		 <div class="banner-top">
			<div class="wmuSlider example1">
				   <div class="wmuSliderWrapper">
                       {% for data in news_info_0 %}
					   <article style="position: absolute; width: 100%; opacity: 0;">
							<div class="banner-bottom">
								<a href="{% url "news_detail" data.id %}"><img class="img-responsive line-in" src="{{ MEDIA_URL }}{{ data.image }}" alt=""  /></a>
								<div class="dummy-text">
									<ul class="social-circle">
										<li><a href="{% url "news_detail" data.id %}"><i > </i></a></li>
										<li><a href="{% url "news_detail" data.id %}"><i class="break"> </i></a></li>
									</ul>
									<div class="doe">
										<h4><a style="color: black" href="{% url "news_detail" data.id %}">{{ data.title }}</a></h4>
										<span>来源：<b>{{ data.source }}</b></span>
                                        <span>时间：<b>{{ data.add_time }}</b></span>
									</div>
								</div>
								<div class="clearfix"> </div>
							</div>
					 	</article>
                       {% endfor %}
{#					 	 <article style="position: absolute; width: 100%; opacity: 0;">#}
{#							<div class="banner-bottom">#}
{#								<a href="{% url "news_detail" data.id %}"><img class="img-responsive line-in" src="{% static "news/images/banner1.jpg" %}" alt=""  /></a>#}
{#								<div class="dummy-text">#}
{#									<ul class="social-circle">			#}
{#										<li><a href="{% url "news_detail" data.id %}"><i > </i></a></li>#}
{#										<li><a href="{% url "news_detail" data.id %}"><i class="break"> </i></a></li>#}
{#									</ul>#}
{#									<div class="doe">#}
{#										<h6>the huntress</h6>#}
{#										<span>By <b>Jane Doe</b></span>#}
{#										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at auctor orci. Nullasc arcu lorem, consectetur eu tristique idnui hendrerit at massa. Vivamus velit ante, blandit eget suscipit ut, volutpat ac erasti augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere .</p>#}
{#									</div>#}
{#								</div>#}
{#								<div class="clearfix"> </div>#}
{#							</div>#}
{#					 	</article>#}
{#					 	 <article style="position: absolute; width: 100%; opacity: 0;">#}
{#							<div class="banner-bottom">#}
{#								<a href="{% url "news_detail" data.id %}"><img class="img-responsive line-in" src="{% static "news/images/banner.jpg" %}" alt=""  /></a>#}
{#								<div class="dummy-text">#}
{#									<ul class="social-circle">			#}
{#										<li><a href="{% url "news_detail" data.id %}"><i > </i></a></li>#}
{#										<li><a href="{% url "news_detail" data.id %}"><i class="break"> </i></a></li>#}
{#									</ul>#}
{#									<div class="doe">#}
{#										<h6>the huntress</h6>#}
{#										<span>By <b>Jane Doe</b></span>#}
{#										<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed at auctor orci. Nullasc arcu lorem, consectetur eu tristique idnui hendrerit at massa. Vivamus velit ante, blandit eget suscipit ut, volutpat ac erasti augue. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere .</p>#}
{#									</div>#}
{#								</div>#}
{#								<div class="clearfix"> </div>#}
{#							</div>#}
{#					 	</article>#}
					 </div>

	            </div>
	            <script src="{% static "news/js/jquery.wmuSlider.js" %}"></script>
				<script>
					 $('.example1').wmuSlider({
						 pagination:false
					});
				</script>

				</div>
			</div>
		</div>
		<!---->
        <div>
			<div class="container">
			<div class="content">
				<div class="content-top">
					<h2>热点新闻</h2>
					<i class="line"> </i>
				</div>
				<p class="you">做有深度的新闻，汇集各方热点，全方位了解，辩证看新闻</p>
				<div class="top-on">
				<div class="content-bottom">
                    {% for data in news_info %}
					<div class="col-md-6 top-pic">
						<div class="col-md-6 bottom-pic">
						<a href="{% url "news_detail" data.id %}"><img class="img-responsive " src="{{ MEDIA_URL }}{{ data.image }}" alt=""  /></a>
						</div>
						<div class="col-md-6 bottom-doe">
						<h4><a style="color: black" href="{% url "news_detail" data.id %}">{{ data.title }}</a></h4>
                            <p>来源：{{ data.source }}</p>
                            <p>时间：{{ data.add_time }}</p>
						</div>
						<div class="clearfix"> </div>
					</div>
                    {% endfor %}
					<div class="clearfix"> </div>
				</div>
				</div>
            <div class="container">
		<div class="single">
			<div class="col-md-9  single-top">
				<div class="text-in">
						<div class="single-men">
                        <div class="clearfix"> </div>
                        </div>
						</div>
                    <div class="comment-grid-top">

                    </div>

            </div>


			</div>
				<div class="col-md-3 single-bottom">
                    <div class="store-right">
                        <h6> Categories</h6>
                        <ul class="store-men">
                            <li><a href="{% url "NewsCategoryList" %}"><span> </span>Contrary to popular </a></li>
                            <li><a href="{% url "NewsCategoryList" %}"><span> </span>simply random text</a></li>
                            <li><a href="{% url "NewsCategoryList" %}"><span> </span> Lorem Ipsum passage </a></li>
                            <li><a href="{% url "NewsCategoryList" %}"><span> </span>undoubtable source </a></li>
                            <li><a href="{% url "NewsCategoryList" %}"><span> </span>Finibus Bonorum et</a></li>
                        </ul>
                    </div>
                </div>
				<div class="clearfix"> </div>
		    </div>
	</div>
{#				<i class="line"> </i>#}
				<!---->
{#				<div class="bottom-content">#}
{#					<div class="col-md-6 award">#}
{#						<h3>awi awards ceremony</h3>						#}
{#						<p>The ‘Award The Inspired’ awards ceremony. The Fuji Film Gallery, Holland. </p>#}
{#						<div class="inverted">#}
{#							<p class="date">4th October to 12 October 2012 10am to 4pm.</p>                       #}
{#							<a href="{% url "news_detail" data.id %}" class="only">Invitation Only</a>#}
{#							<div class="clearfix"> </div>#}
{#						</div>#}
{#						<a href="{% url "news_detail" data.id %}"><img class="img-responsive " src="{% static "news/images/po.jpg" %}" alt=""></a>#}
{#						<div class="share">#}
{#							<p>Share <i class="down"> </i></p>#}
{#							<ul class="social-in tin-in">#}
{#								<li><i> </i></li>						#}
{#								<li><i class="tin"> </i></li>#}
{#								<li><i class="message"> </i></li>#}
{#							</ul>#}
{#							<div class="clearfix"> </div>#}
{#						</div>#}
{#					</div>#}
{#					<div class="col-md-6 award-bottom">#}
{#						<h3>Have You Been Invited?</h3>#}
{#						<p>If you have an awards ceremony invitation code, please enter it along with your e-mail address in the form below.</p>#}
{#						<form >					    	#}
{#						   <input type="text" value="Your E-mail..">#}
{#						   <input type="text" value="Invitation Code..">#}
{#						   <input type="submit" value="Submit RSVP">	#}
{#						   </form>#}
{#						   <p><a href="{% url "news_detail" data.id %}">Don’t have an invitation?</a></p>#}
{#						   <a href="{% url "NewsIndex" %}" class="logo-bottom"><img src="{% static "news/images/logo-1.png" %}" alt="" ></a>#}
{#					</div>#}
{#					<div class="clearfix"> </div>#}
{#				</div>#}
			</div>
		</div>
        <!---->

		<!---->

		<div class="container">
		<div class="footer">
			<div class="footer-top">
				<div class="col-md-4 amet-sed">
				<h4>navigation</h4>
				<i class="line"> </i>
					<ul class="nav-bottom">
						<li  ><a href="{% url "NewsIndex" %}" >HOME  </a> </li>
						<li><a href="{% url "NewsEvents" %}" > EVENTS</a></li>
						<li><a href="{% url "NewsSearch" %}"> SEARCH </a></li>
						<li><a href="{% url "NewsCategory" %}" > CATEGORY</a></li>
						<li><a href="{% url "NewsRegister" %}">REGISTER </a></li>
						{% if not user.is_authenticated %}
						<li><a href="{% url "NewsLogin" %}">LOGIN </a></li>
                        {% else %}
                        <li><a href="{% url "user_logout" %}">LOGOUT </a></li>
                        {% endif %}
						<li  ><a href="#" >RSVP</a> </li>
						<li><a href="#" >PRIVACY POLICY</a></li>
					</ul>
				</div>
				<div class="col-md-4 amet-sed ">
				<h4>get in touch</h4>
				<i class="line"> </i>
					<ul class="nav-bottom">
						<li  ><a href="{% url "NewsContact" %}" >CONTACT US</a> </li>
						<li><a href="#" >PRIVACY POLICY</a></li>
						<li><a href="#">TERMS &amp; CONDITIONS </a></li>
					</ul>
					<p>Email: <a href="mailto:info@example.com">info@example.com</a></p>
				</div>
				<div class="col-md-4 amet-sed ">
				<h4>share this page</h4>
				<i class="line"> </i>
				<ul class="social-in msg-social">
					<li><a href="#"><i> </i></a></li>
					<li><a href="#"><i class="tin"> </i></a></li>
					<li><a href="#"><i class="message"> </i></a></li>
					<li><a href="#"><i class="youtube"> </i></a></li>
				</ul>
				<p>follow us on twitter:<a href="#">@example</a></p>
				</div>
				<div class="clearfix"> </div>
			</div>
		</div>
		 <script type="text/javascript">
						$(document).ready(function() {
							/*
							var defaults = {
					  			containerID: 'toTop', // fading element id
								containerHoverID: 'toTopHover', // fading element hover id
								scrollSpeed: 1200,
								easingType: 'linear'
					 		};
							*/

							$().UItoTop({ easingType: 'easeOutQuart' });

						});
					</script>
				<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
	</div>
</body>
</html>